<template>
    <div class="addSchoolMate">
        <div>
            <el-form :model="schoolmateForm"  ref="ruleForm" label-width="120px">
                <el-form-item label="姓名" prop="name">
                    <el-col :span="8">
                        <el-input v-model="schoolmateForm.alumniname" placeholder="请输入姓名"></el-input>
                    </el-col>
                    <!--<el-col :span="12">
                        <el-form-item label="头衔" prop="region">
                            <el-input v-model="schoolmateForm.name" placeholder="请输入头衔"></el-input>
                        </el-form-item>
                    </el-col>-->
                </el-form-item>
                <!--<el-form-item label="联系方式" prop="region">
                    <el-col :span="20">
                        <el-input v-model="schoolmateForm.name" placeholder="请输入联系方式"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="介绍" prop="name">
                    <el-col :span="20">
                        <el-input v-model="schoolmateForm.name" type="textarea" placeholder="请输入内容"></el-input>
                    </el-col>
                </el-form-item>-->
                <el-form-item label="毕业年份">
                    <el-col :span="8">
                        <el-date-picker type="year" value-format="yyyy" placeholder="选择毕业年份" v-model="schoolmateForm.year" style="width: 100%;"></el-date-picker>
                       <!-- <el-date-picker type="year" placeholder="选择毕业年份" v-model="schoolmateForm.year" style="width: 100%;"></el-date-picker>-->
                    </el-col>
                </el-form-item>
                <!--<el-form-item label="发表文章" prop="name">
                    <el-col :span="20">
                        <el-input v-model="schoolmateForm.name" type="textarea" placeholder="请输入内容"></el-input>
                    </el-col>
                </el-form-item>
                <el-form-item label="获奖" prop="name">
                    <el-col :span="10">
                        <el-input v-model="schoolmateForm.name" type="textarea" placeholder="请输入内容"></el-input>
                    </el-col>
                    <el-col :span="10">
                        <el-form-item label="获奖时间" prop="date1">
                            <el-date-picker type="date" placeholder="选择日期" v-model="schoolmateForm.date1" style="width: 100%;"></el-date-picker>
                        </el-form-item>
                    </el-col>
                </el-form-item>
                <el-form-item label="照片" prop="name">
                    <el-col :span="4">
                        <el-upload
                                class="upload-demo"
                                action="https://jsonplaceholder.typicode.com/posts/"
                                :on-preview="handlePreview"
                                :on-remove="handleRemove"
                                :before-remove="beforeRemove"
                                multiple
                                :limit="3"
                                :on-exceed="handleExceed"
                                :file-list="fileList">
                            <el-button size="small" type="summary">请选择文件</el-button>
                        </el-upload>
                    </el-col>
                    <el-col :span="14">
                        <el-button class="upload">上传</el-button>
                    </el-col>
                </el-form-item>-->
                <el-form-item label="是否显示">
                    <el-radio-group v-model="schoolmateForm.flag">
                        <el-radio :label="'0'" selected>是</el-radio>
                        <el-radio :label="'1'">否</el-radio>
                    </el-radio-group>
                </el-form-item>

                <el-form-item>
                    <el-button type="primary" @click="addSubmit" :loading="loading">提交</el-button>
                </el-form-item>

            </el-form>
        </div>
    </div>
</template>

<script>
    import { addAlumni,updateAlumni } from '@/api/memberManage'
    export default {
        name: "AddSchoolMate",
        props: {
            operateType: {
                type: String,
                default: () => 'add'
            },
            schoolmateInfo: {
                type: Object,
                default: () => {
                    return {
                        alumniid: '',
                        alumniname: '',
                        year: '',
                        flag: '',
                    }
                }
            }
        },
        watch: {
            schoolmateInfo: {
                handler(newVal, objVal) {
                    if(newVal !== objVal){
                        this.schoolmateForm = newVal
                    }
                },
            }
        },
        data() {
            return {
                loading: false,
                schoolmateForm: this.schoolmateInfo
            }
        },
        methods:{
            async addSubmit(){
                if(this.operateType === 'add'){
                    try {
                        this.loading = true
                        await addAlumni(this.schoolmateForm)
                        this.$message({
                            type: 'success',
                            message: '成功添加'
                        })
                        this.$emit('updateTable')
                    } catch (e) {
                        console.log( new Error(e))
                    }
                    this.loading = false
                } else {
                    try {
                      /*  console.log(this.schoolmateForm)*/
                        this.schoolmateForm.alumniid = this.schoolmateInfo.alumniid
                        this.loading = true
                        const res = await updateAlumni(this.schoolmateForm)
                        console.log(res)
                        this.$message({
                            type: 'success',
                            message: '成功'
                        })
                        this.$emit('updateTable')
                    } catch (e) {
                        console.log( new Error(e))
                    }
                    this.loading = false
                }
            }
        }
    }
</script>

<style lang="scss" scoped>
    .addSchoolMate{
        /deep/ .el-form-item {
            margin-bottom: 15px;
        }
        /deep/ .el-form-item__label {
            font-size: 14px;
        }
        /deep/ .el-input__inner, .el-textarea__inner, .textarea__inner {
            font-size: 12px;
        }
        .upload, .submit{
            font-size: 16px;
            background: #cccccc;
            height: 35px;
            width: 70px;
        }
        .upload{
            color: #D0021B;
        }
        .submit{
            color: #3D434F;
        }
    }

</style>